<template>
	<view>
		<image src="/static/common/bg1.png" class="pagebg1" mode=""></image>
		<u-navbar :safeAreaInsetTop="true" title="个人设置" :autoBack="true" :bgColor="'rgba(255,255,255,'+opc+')'"
			placeholder>

		</u-navbar>
		<view class="pagecon">
			<view class="box">
				<view class="box__title">
					账号设置
				</view>
				<view class="box__item" v-for="(item,index) in tlist" :key="index" @click="clickset(item)">
					<view class="box__item__iconb">
						<image :src="'/static/set/t'+index+'.png'" :style="item.sty" mode=""></image>
					</view>
					<view class="box__item__label">
						{{item.text}}
					</view>
					<u-icon name="arrow-right" size="25rpx" color="#B2B2B2"></u-icon>
				</view>
				<view class="box__title">
					系统设置
				</view>
				<view class="box__item" v-for="(item,index) in tlist1" :key="'i'+index" @click="clickset(item)">
					<view class="box__item__iconb">
						<image :src="'/static/set/i'+index+'.png'" :style="item.sty" mode=""></image>
					</view>
					<view class="box__item__label">
						{{item.text}}
					</view>
					<view class="box__item__val">
						{{item.val}}
					</view>
					<u-icon name="arrow-right" size="25rpx" color="#B2B2B2"></u-icon>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				opc: 0,
				tlist: [{
						text: '注销账号',
						sty: 'width: 38rpx;height: 36rpx;',
						url: '/pages/personal/logout',
						type: 0
					},
					{
						text: '退出登录',
						sty: 'width: 46rpx;height: 47rpx;',
						url: '',
						type: 1
					},
				],
				tlist1: [{
						text: '清理缓存',
						sty: 'width: 45rpx;height: 45rpx;',
						url: '',
						type: 2,
						val: '1.8M'
					},
					{
						text: '隐私政策',
						sty: 'width: 30rpx;height: 33rpx;',
						url: '',
						type: 0
					},
					{
						text: '服务条款',
						sty: 'width: 46rpx;height: 46rpx;',
						url: '',
						type: 0
					},
				]
			};
		},
		methods: {
			clickset(item) {
				let _this = this
				if (item.type == 0) { //跳转
					this.navto(item.url)
				}
				if (item.type == 1) {
					uni.showModal({
						title: '提示',
						content: '确认退出登录？',
						success(r) {
							if (r.confirm) {
								uni.removeStorageSync('token')
								uni.removeStorageSync('userInfo')
								uni.reLaunch({
									url: '/pages/index/login2'
								})
							}
						}
					})
				}
				if (item.type == 2) {
					item.val = ''
					uni.$u.toast('缓存已清除')
				}
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f4f4f4;
	}

	.pagecon {
		padding: 20rpx 30rpx;

		.box {
			background: #FFFFFF;
			border-radius: 30rpx 30rpx 30rpx 30rpx;
			padding: 0 38rpx 28rpx 37rpx;

			&__title {
				font-family: PingFang-SC, PingFang-SC;
				font-weight: bold;
				font-size: 24rpx;
				color: #888888;
				line-height: 24rpx;
				padding: 46rpx 0 34rpx;
			}

			&__item {
				display: flex;
				align-items: center;
				height: 103rpx;

				&__iconb {
					width: 46rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					margin-right: 17rpx;
				}

				&__label {
					font-family: PingFang-SC, PingFang-SC;
					font-weight: bold;
					font-size: 30rpx;
					color: #0B0B0B;
					line-height: 30rpx;
					flex: 1;
				}

				&__val {
					font-family: PingFang-SC, PingFang-SC;
					font-weight: bold;
					font-size: 25rpx;
					color: #B2B2B2;
					line-height: 25rpx;
					margin-right: 10rpx;
				}

				&__more {
					width: 17rpx;
					height: 25rpx;
				}
			}
		}
	}
</style>